<div class="row">
	<div class="col-md-12">
		<ol class="breadcrumb">
			<li>
				<a href="#" onclick="toHome()">
					主页
				</a>
			</li>
			<li>
				<a href="#" class="toList" onclick="toMovieSeat()">
					电影座位列表 
				</a>
			</li>
			<li class="active">
				全量添加电影座位
			</li>
		</ol>
	</div>
</div>
<form role="form" class="form-horizontal">
	<div class="row page-cont">
		<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 cont-top">
			<div class="panel panel-white">
				<div class="panel-heading">
					<h4 class="panel-title">
						<span class="title-text">电影座位录入</span>
					</h4>
					<div class="panel-tools">
						<div class="dropdown">
							<a data-toggle="dropdown" class="btn btn-xs dropdown-toggle btn-transparent-grey">
								<i class="fa fa-cog"></i>
							</a>
							<ul class="dropdown-menu dropdown-light pull-right" role="menu">
								<li>
									<a class="panel-collapse collapses" href="#"><i class="fa fa-angle-up"></i> <span>折叠</span> </a>
								</li>
								<li>
									<a class="panel-expand" href="#">
										<i class="fa fa-expand"></i> <span>全屏</span>
									</a>
								</li>
							</ul>
						</div>
						<a class="btn btn-xs btn-link panel-close" href="#">
							<i class="fa fa-times"></i>
						</a>
					</div>
				</div>
				<div class="panel-body">
					<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">影片名称</label>
					    <div class="col-sm-6">
					      <input type="text" class="form-control" id="movieName" />
					    </div>
						<span class="col-sm-4 tips">
					    	<i class="fa fa-info-circle"></i>
					    	选择适用此设置的影片名称
					    </span>					    
				  	</div>	
					<div class="form-group panel-cont movie-search">
					    <label class="col-sm-2 control-label"></label>
					    <div class="col-sm-6">
					    	<ul class="movie-list">
					    		
					    	</ul>
					    </div>				    
				  	</div>					  		
					<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">确认影片名称</label>
					    <div class="col-sm-6">
					      <input type="text" readonly="readonly" class="form-control" id="sureMovieName" />
					    </div>
						<span class="col-sm-4 tips">
					    	<i class="fa fa-info-circle"></i>
					    	提交的影片以此栏内容为准，选填
					    </span>					    
				  	</div>					 				  					  					  				
					<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">座位图片_可选</label>
					    <div class="col-sm-6">
					    	<div class="uploadImg">
					    		<div>选择文件</div>
					    		<input type="file" class="form-control upload" />
					    	</div>
					    </div>
					    <span class="col-sm-4 tips">
					    	<i class="fa fa-info-circle"></i>
					    	类型为 gif,jpg,jpeg,bmp,png
					    </span>
				  	</div>
				  	<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">图片预览</label>
					    <div class="col-sm-6 imgShow seat-choose">
					      
					    </div>
				  	</div>
					<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">座位图片_已选</label>
					    <div class="col-sm-6">
					    	<div class="uploadImg">
					    		<div>选择文件</div>
					    		<input type="file" class="form-control upload" />
					    	</div>
					    </div>
					    <span class="col-sm-4 tips">
					    	<i class="fa fa-info-circle"></i>
					    	类型为 gif,jpg,jpeg,bmp,png
					    </span>
				  	</div>
				  	<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">图片预览</label>
					    <div class="col-sm-6 imgShow seat-choosen">
					      
					    </div>
				  	</div>				  	
					<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">座位图片_已售</label>
					    <div class="col-sm-6">
					    	<div class="uploadImg">
					    		<div>选择文件</div>
					    		<input type="file" class="form-control upload" />
					    	</div>
					    </div>
					    <span class="col-sm-4 tips">
					    	<i class="fa fa-info-circle"></i>
					    	类型为 gif,jpg,jpeg,bmp,png
					    </span>
				  	</div>
				  	<div class="form-group panel-cont">
					    <label class="col-sm-2 control-label">图片预览</label>
					    <div class="col-sm-6 imgShow seat-sale">
					      
					    </div>
				  	</div>				  	
				  	<div class="form-group">
				  		<div class="col-sm-2 col-sm-offset-3">
				  			<button type="button" class="btn btn-danger submit-btn">提交&nbsp;<i class="fa fa-arrow-circle-right"></i></button>
				  		</div>
				  	</div>
				</div>
			</div>
		</div>
	</div>
</form>
<script>
	/*************************************变量******************************************/
	var username = GetQueryString("username");    // 用户姓名
	var token = MXCookie.get("token",token);      // 登陆token 
	/*************************************事件******************************************/	
	// 上传图片
	addUploadImg();

	// 影片搜索
	$("#movieName").keyup(function(event) {
		movieName = $("#movieName").val();
		if(movieName != ""){
			movieSearch(movieName);
		}		
	});

	// 提交
	$(".submit-btn").click(function(){
		if(msgCheck()){
			seatAdd();
		}
	});


	/*************************************函数******************************************/
	// 信息验证
	function msgCheck(){
		if($("#sureMovieName").val() == ""){
			tips("请确认影片名称");
			$(this).focus();	
			return false;		
		}else if(!$(".seat-choose img").attr("src")){
			tips("请选择座位图");	
			return false;		
		}else if(!$(".seat-choosen img").attr("src")){
			tips("请选择已选择座位图");
			return false;		
		}else if(!$(".seat-sale img").attr("src")){
			tips("请选已售择座位图");
			return false;		
		}else{
			return true;
		}
	}


	// 影片搜索
	function movieSearch(movieName){
		$(".movie-list").html("");
		$.ajax({
			url: localStorage.grobalUrl + "/seat/getFilmRange",
			type:"post",
			data:{
				username: username,
				token: token,
				filmName: movieName
			},
			success: function(data){
				console.log(data);
				if(data.length > 0){
					$(".movie-search").show();
					for(var i = 0; i < data.length; i ++){
						var dataVal = data[i];
						$(".movie-list").append('<li data-id="'+ dataVal.film_id +'">'+ dataVal.show_name +'</li>');
					}
					$(".movie-list li").click(function(){
						$("#sureMovieName").val($(this).text()).attr("data-id",$(this).attr("data-id"));
						$("#movieName").val($(this).text());
						$(".movie-search").hide();
					});
				}
			},
			error: function(err){
				console.log(err);
			}
		});			
	}	

	// 座位录入
	function seatAdd(){
		$.ajax({
			url: localStorage.grobalUrl + "/seat/allSeat", 
			type:"post",
			data: {
				username: username,
				token: token,
				filmId: $("#sureMovieName").attr("data-id"),
				filmName: $("#sureMovieName").val(),
				able: $(".seat-choose img").attr("src").split(",")[1],
				pick: $(".seat-choosen img").attr("src").split(",")[1],
				sold: $(".seat-sale img").attr("src").split(",")[1],
			},
			success: function(data){
				console.log(data);
				if(data.errCode == "00000"){
					tips("成功");
					getPage("view/movieSeat/list.html");
				}else{
					tips("提交失败");
				}
			},
			error: function(err){
				console.log(err);
			}
		});
	}
	
	
	
</script>